<template>
  <div class="schedules-form" v-loading="loading">
    <el-form ref="addform" :rules="rules" :model="addForm" label-width="140px" size="mini">
      <el-form-item label="会议栏目" prop="trees">
        <el-cascader v-model="addForm.trees" :options="options" :show-all-levels="false" :disabled="type === 'edit'"></el-cascader>
      </el-form-item>
      <el-form-item label="会议名称" prop="subject">
        <el-input v-model="addForm.subject"></el-input>
      </el-form-item>
      <el-form-item label="排序" prop="sequence">
        <el-input v-model="addForm.sequence" ></el-input>
      </el-form-item>
      <el-form-item label="会议到期自动禁用" prop="autoDisable">
        <el-radio v-model="addForm.autoDisable" :label="1">是</el-radio>
        <el-radio v-model="addForm.autoDisable" :label="0">否</el-radio>
      </el-form-item>
      <el-form-item label="会议开始时间" prop="beginTime">
        <el-date-picker
            v-model="addForm.beginTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
            </el-date-picker>
      </el-form-item>
     <el-form-item label="会议结束时间" prop="endTime">
        <el-date-picker
            v-model="addForm.endTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            default-time="23:59:59"
            placeholder="选择日期时间">
            </el-date-picker>
      </el-form-item>

      <el-form-item size="large">
        <el-button type="primary" @click="addFun">新增</el-button>
        <el-button @click="cancelFun">取消</el-button>
      </el-form-item>
    </el-form>
  </div>

</template>
<script>
import {
  mapGetters
} from 'vuex'
import axios from 'axios'
import {createConfig} from '@/assets/js/tools'
export default {
  name: "newsAdd",
  data() {
    return {
      loading:false,
      addForm: {
          subject:'',
          beginTime:'',
          endTime:'',
          trees:'',
          sequence: 999,
          autoDisable: 1
        },
        rules:{
          subject: [
            { required: true, message: '名称不能为空', trigger: 'blur' }
          ],
          beginTime: [
            { required: true, message: '开始时间为空', trigger: 'blur' }
          ],
          endTime: [
            { required: true, message: '结束时间为空', trigger: 'blur' }
          ],
          trees: [
            { required: true, message: '会议栏目不能为空', trigger: 'blur' }
          ],
          sequence: [
            { required: true, message: '会议排序不能为空', trigger: 'blur' }
          ],
          autoDisable: [
            { required: true, message: '请选择会议结束后是否自动禁用会议', trigger: 'blur' }
          ],

        },
        options:[]
    };
  },
  props: ['modules','type','groupId'],
  computed: {
    ...mapGetters({
      userInfo:'getUserInfo'
    })
  },
  watch:{

  },
  methods: {
    addFun(){
      this.$refs['addform'].validate((valid) => {
       if (valid) {
         this.addModules()
       } else {
         return false;
       }
     });
    },
    addModules(){
      if(!Array.isArray(this.addForm.trees) || this.addForm.trees.length!=2) {
        this.$message.error('请选择会议栏目');
           return;
      }
      let param={
          subject:this.addForm.subject,
          groupId: this.addForm.trees[0],
          columnId:this.addForm.trees[1],
          beginTime: this.addForm.beginTime,
          endTime: this.addForm.endTime,
          sequence: this.addForm.sequence,
          autoDisable: this.addForm.autoDisable
      }

      this.loading=true
      let path="/station/api/meeting/createMeeting?vs="+Date.now();
      if(this.type==='edit'){
        param.id=this.modules.id
        path="/station/api/meeting/editMeeting?vs="+Date.now();
      }
      let config=createConfig(this.userInfo.token)
      axios.post(path, param, config).then((data) => {
        if(data.data.status==="SUCCESS"){
          this.$message({
            showClose: true,
            message: '新增会议成功',
            type: 'success'
          })
          this.$emit('hascreated');
        }else {
           this.$message({
             showClose: true,
             message: data.data.errorMsg ? data.data.errorMsg : '新增会议失败',
             type: 'error'
           })
        }
        this.loading=false
      }).catch( (err)=>{
        // eslint-disable-next-line no-console
        console.log(err)
        this.$message({
          showClose: true,
          message: '新增会议失败',
          type: 'error'
        })
        this.loading=false
      })
    },
    cancelFun(){
      this.$emit('cancelAdd');
    },
    loadUserGroupAndColumn(){
        this.loading = true;
        let path = "/station/api/meeting/group/loadUserGroupAndColumn?vs="+Date.now();
        let headers = { token: this.userInfo.token };
        axios
            .get(path, {
            params: {},
            headers: headers,
            })
            .then(data => {
            if (data.data.status === "SUCCESS") {
                this.hasLoading = true;
                let groups = data.data.content;
                if(!groups || groups.length ===0 ){
                    this.$message.error(
                        data.data.errorMsg ? data.data.errorMsg : "你还没有对应的会议权限，请联系管理员"
                    );
                } else {
                    let options = []
                    groups.forEach(element => {  
                        if(element.columns && element.columns.length>0){
                            let item={value:element.id, label:element.groupName,children:[]}
                            for(let i=0; i< element.columns.length; i++) {
                                let column = element.columns[i]
                                let columnItem = {value:column.id, label:column.columnName}
                                item.children.push(columnItem)
                            }
                            options.push(item)
                        }
                    });
                    this.options = options
                }

            } else {
                this.$message.error(
                data.data.errorMsg ? data.data.errorMsg : "获取会议栏目失败，请联系管理员"
                );
            }
            this.loading = false;
            })
            .catch(err => {
            // eslint-disable-next-line no-console
            console.log(err);
            this.$message.error("获取会议栏目失败");
            this.loading = false;
            }); 
    }
  },
  mounted(){
    this.loadUserGroupAndColumn();
    if(this.type==='edit'){
      this.addForm=Object.assign({}, this.modules);
      this.addForm.trees= []
      this.addForm.trees.push(this.modules.groupId)
      this.addForm.trees.push(this.modules.columnId)
    }

  }
};
</script>
<style scoped lang="scss">
  .schedules-form{
    position: relative;
  }
</style>
